define(['url','template','jquery'],(url,template) => {
    class Header {
        constructor () {
            this.loadHTML().then(() => {
                this.rendTab()
            }).then(() => {
              this.cartnumshop()
            }).then(()=> {
                this.userLoginshow()
            }).then(() => {
                this.delUserlist()
            }).then(() => {
                this.showCookie ()
            })
        }
        loadHTML () {
            return new Promise (resolve => {
                $('header').load('/html/modules/header.html',resolve)
            })
        }
        rendTab () {
           $.get(url.getTabs, resp => {
               if(resp.code === 200 ) {
                   let {list} = resp.data;
                   const removeList = ["零食", "今日推荐", "女装", "日用家居","男鞋","文体娱乐","配饰"]
                   list = list.filter(item => {
                    return removeList.indexOf(item.name) === -1;
                   })
                $('#tablist').html(template('tabListTemplate', {list}))
               }
           }) 

        }
        cartnumshop () {
            let cart = localStorage.getItem('cart')
            if(cart) {
                cart = JSON.parse(cart)
                const totalCount = cart.reduce((count, shop) => count + shop.count, 0)
                $('#logo-shopnumshow').html(totalCount)
                $('#shopnumshow').html(totalCount)
            }else {
                $('#logo-shopnumshow').html(0)
                $('#shopnumshow').html(0)
            }
        }
        userLoginshow () {
            $('#head-login').on('click', () => {
                $('#login-html').attr('style','display:block;')
               this.userLogin()
            })
            this.headLogin()
        }
        headLogin () {
            $('#hide-btn').on('click', ()=> {
                $('#login-html').attr('style','display:none;') 
            })
        }
        userLogin () {
            $('#login-btn-ok').on('click', ()=> {
                const username = $('#username').val()
                const password = $('#password').val()
                var userList = localStorage.getItem('userinfo')
                if (userList) {
                    userList = JSON.parse(userList)
                    var hasExist  = userList.some(user => {
                        return user.username === username 
                    })
                    if(hasExist) {
                        var isExist = userList.some(user => {
                            return user.username === username && user.password === password
                        })
                        if (isExist) {
                            this.setCookie('username', username)
                            $('#btn-ok-username').attr('style','display:block;')
                            setTimeout(()=>{
                                $('#login-html').attr('style','display:none;')
                                $('#head-login').attr('style','display:none;')
                                $('#head-login-user-reg').attr('style','display:none;')
                                $('#user-login-hello').attr('style','display:block;')
                                $('#user-login-word').attr('style','display:block;')
                                $('#btn-ok-username').attr('style','display:none;')
                                $('#user-login-hello b').html(username)
                            },2000)
                        } 
                        else {
                            $('#deger-btn-notok').attr('style','display:block;')
                            setTimeout(()=>{
                                $('#deger-btn-notok').attr('style','display:none;')
                            },2000)
                        }
                    }
                    else{
                        $('#btn-ok-username-null').attr('style','display:block;')
                        setTimeout(()=>{
                            $('#btn-ok-username-null').attr('style','display:none;')
                            location.href = '/html/register.html'
                        },2000)
                    }
    
                 } else {
                    $('#btn-ok-username-null').attr('style','display:block;')
                    setTimeout(()=>{
                        $('#btn-ok-username-null').attr('style','display:none;')
                        location.href = '/html/register.html'
                    },2000)
                    
                }
            }) 
        }
        setCookie (key, value, options) {
            options = options ? Object.assign({ path: '/' },  options) : { path: '/' }
    
            var str = `${key}=${encodeURIComponent(value)};path=${options.path}`
            if (options.expires) {
                var d = new Date()
                d.setDate(d.getDate() + options.expires)
                str += `;expires=${d.toUTCString()}`
            }
            document.cookie = str
        }
        delUserlist () {
            $('#user-login-word').on('click', ()=> {
                if (confirm('确认要退出吗？')) {
                    this.setCookie('username', '', { expires: -1 })
                    $('#head-login').attr('style','display:block;')
                    $('#head-login-user-reg').attr('style','display:block;')
                    $('#user-login-hello').attr('style','display:none;')
                    $('#user-login-word').attr('style','display:none;')
                    
                }
            })
        }
        getCookie (key) {
            var str = document.cookie
            var cookies = str.split('; ')
            var obj = {}
            cookies.forEach(item => {
                var arr = item.split('=')
                obj[arr[0]] = decodeURIComponent(arr[1])
            })
            return obj[key]
        }
        showCookie () {
         const username = this.getCookie('username') 
         if(username) {
            $('#head-login').attr('style','display:none;')
                 $('#head-login-user-reg').attr('style','display:none;')
                 $('#user-login-hello').attr('style','display:block;')
                 $('#user-login-word').attr('style','display:block;')
                 $('#user-login-hello b').html(username)
         }
        }

    }
    return new Header ()
})